<template>
	<div class="Page">
		<Page
			show-sizer
			show-elevator
			show-total
			:size="size"
			placement="top"
			:total="data.totalSize"
			:page-size="data.pageSize"
			:current="data.currentPage + 1"
			:page-size-opts="[10, 20, 30]"
			@on-change="changePage"
			@on-page-size-change="changePageSize">
		</Page>
	</div>
</template>

<script>
export default {
	name: 'page',
	props: ['data', 'size'],
	methods: {
		changePage(page) {
			this.$emit('on-change-page', page); //返回改变后页码
		},
		changePageSize(pagesize) {
			this.$emit('on-change-pagesize', pagesize); //返回每页条数
		}
	}
}
</script>

<style lang="less">
.Page {
	text-align: center;
	margin-top: 30px;
	.ivu-select-dropdown {
		width:auto !important;
		left:auto !important;
	}
}

</style>
